import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_test_demo/model/index.dart';
import 'package:flutter_test_demo/pages/order_bloc/view.dart';

import 'cubit.dart';
import 'state.dart';

class ShopCartBlocPage extends StatelessWidget {
  const ShopCartBlocPage({super.key});

  @override
  Widget build(BuildContext context) {
    return BlocProvider(
      create: (BuildContext context) => ShopCartBlocCubit(),
      child: Builder(builder: (context) => _buildPage(context)),
    );
  }

  Widget _buildPage(BuildContext context) {
    final cubit = BlocProvider.of<ShopCartBlocCubit>(context);

    return Scaffold(
      appBar: AppBar(
        title: const Text('购物车'),
        centerTitle: true,
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        actions: [
          IconButton(
            onPressed: cubit.clearCart,
            icon: const Icon(Icons.delete),
          ),
        ],
      ),
      body: _buildContentWidget(cubit, context),
    );
  }

  Widget _buildContentWidget(ShopCartBlocCubit cubit, BuildContext context) {
    return Column(
      children: [
        BlocBuilder<ShopCartBlocCubit, ShopCartBlocState>(
          builder: (context, state) {
            return _buildGoodsList(cubit);
          },
        ),
        _buildBottomWidget(cubit, context)
      ],
    );
  }

  Widget _buildGoodsList(ShopCartBlocCubit cubit) {
    if(cubit.state.cartGoodsList.isEmpty) {
      return const Expanded(
        child: Center(child: Text("暂无数据", style: TextStyle(fontSize: 14),)),
      );
    }
    return Expanded(
      child: BlocBuilder<ShopCartBlocCubit, ShopCartBlocState>(
        builder: (context, state) {
          return ListView.separated(
            itemBuilder: (context, index){
              CartModel model = state.cartGoodsList[index];
              return _buildItemWidget(model, cubit);
            },
            separatorBuilder: (context, index){
              return Container(height: 10);
            },
            itemCount: state.cartGoodsList.length,
            shrinkWrap: true,
            padding: const EdgeInsets.all(12),
          );
        },
      ),
    );
  }

  Widget _buildItemWidget(CartModel model, ShopCartBlocCubit cubit) {
    return Container(
      padding: const EdgeInsets.all(12),
      decoration: BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.circular(8)
      ),
      child: Row(
        children: [
          Container(
            color: const Color(0xFFdddddd),
            width: 100,
            height: 100,
            child: const Icon(Icons.image),
          ),
          const SizedBox(width: 12,),
          Expanded(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(model.shopCartName ?? '', style: const TextStyle(fontSize: 16, fontWeight: FontWeight.w600),),
                _buildSizedBoxWidget(),
                Text("商品编码：${model.shopCartCode ?? ''}", style: const TextStyle(fontSize: 14),),
                _buildSizedBoxWidget(),
                _buildCountWidget(model, cubit)
              ],
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildCountWidget(CartModel model, ShopCartBlocCubit cubit) {
    return Row(
      children: [
        Text("￥${model.shopCartPrice}", style: const TextStyle(fontSize: 14, color: Color(0xFF666666)),),
        Expanded(
          child: Row(
            mainAxisAlignment: MainAxisAlignment.end,
            children: [
              InkWell(
                onTap: () => cubit.addCount(model),
                child: _buildContainerWidget(
                  widget: const Text("+", style: TextStyle(fontSize: 16),),
                ),
              ),
              const SizedBox(width: 6,),
              BlocBuilder<ShopCartBlocCubit, ShopCartBlocState>(
                builder: (context, state) {
                  return _buildContainerWidget(
                    widget: Text("${model.shopCartQty}", style: const TextStyle(fontSize: 16),),
                  );
                },
              ),
              const SizedBox(width: 6,),
              InkWell(
                onTap: () => cubit.subCount(model),
                child: _buildContainerWidget(
                  widget: const Text("-", style: TextStyle(fontSize: 16),),
                ),
              ),
            ],
          ),
        )
      ],
    );
  }

  Widget _buildContainerWidget({required Widget widget}) {
    return Container(
      width: 30,
      height: 30,
      color: const Color(0xFFDDDDDD),
      child: Center(child: widget,),
    );
  }

  Widget _buildBottomWidget(ShopCartBlocCubit cubit, BuildContext context) {
    return Container(
      color: Colors.white,
      padding: const EdgeInsets.symmetric(vertical: 12, horizontal: 14),
      child: _buildButtonWidget(cubit, context),
    );
  }

  Widget _buildButtonWidget(ShopCartBlocCubit cubit, BuildContext context) {
    return Row(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: [
        BlocBuilder<ShopCartBlocCubit, ShopCartBlocState>(
          builder: (context, state) {
            return Text("共计：${cubit.totalPrice()}", style: const TextStyle(fontSize: 14),);
          },
        ),
        InkWell(
          onTap: () {
            if(cubit.state.cartGoodsList.isNotEmpty) {
              bottomDialog(cubit, context);
            }
          },
          child: Container(
            padding: const EdgeInsets.symmetric(horizontal: 18, vertical: 10),
            decoration: BoxDecoration(
                color: Colors.blue,
                borderRadius: BorderRadius.circular(4)
            ),
            child: const Text('结算', style: TextStyle(color: Colors.white),),
          ),
        ),
      ],
    );
  }

  void bottomDialog(ShopCartBlocCubit cubit, BuildContext context) {
    showModalBottomSheet(
      context: context,
      backgroundColor: Colors.white,
      builder: (context) {
        return Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            const Padding(
              padding: EdgeInsets.symmetric(vertical: 12),
              child: Text("请选择支付方式", style: TextStyle(fontSize: 18),),
            ),
            Wrap(
              children: cubit.state.payWay.map((e) {
                return ListTile(
                  title: Text(e, style: const TextStyle(fontSize: 16),),
                  onTap: () async {
                    await cubit.submitOrder(e);
                    Navigator.of(context).pop();
                    Navigator.push(context, MaterialPageRoute(builder: (context) => OrderBlocPage()));
                  },
                );
              }).toList(),
            ),
          ],
        );
      }
    );
  }

  Widget _buildSizedBoxWidget() {
    return const SizedBox(height: 10);
  }

}


